<html lang="es">

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

    <body lang="en">
        <div id="main">
            <div id="content">
                <div id="masthead">
                    <span class="head">Consultar Marcas</span>
                    <ul class="breadcrumbs">
                        <li>
                            <?php
                            if ($this->session->userdata('tipo') == 1) {
                                echo "Administrador";
                            } else if ($this->session->userdata('tipo') == 2) {
                                echo "Jefe";
                            }else
                                echo "Usuario";
                            ?> :  
                            Hola <?php echo $this->session->userdata('username'); ?></li>

                    </ul>
                </div>

                <!-- ENDS Headline -->

                <div id="page-content-full">
                    <div id="notificacionBarHeader">  
                        <!--<div id="page-content">-->
                    </div>
                    <div>
                        <div class="ui-widget">
                            <label>Empleado: &nbsp;&nbsp;</label>
                            <input name="subject"  id="search" size="30" type="text" onkeyup="auto('<?php echo $this->session->userdata('jefe') ?>')" cols="25" class="form-poshytip" title="Escriba el nombre o cédula del Usuario" />
                            <input type="hidden" value="<?= base_url() ?>" id="hiddenurl" />     
                        </div>
                        <br>
                    </div>
                    <div class="ui-widget">
                        <label>Desde: &nbsp;</label>
                        <input type="text" name="desde"  readonly="true" value="Seleccione la fecha" id="desde1">
                        <label>Hasta: &nbsp;</label>
                        <input type="text" name="hasta" readonly="true" value="Seleccione la fecha" id="hasta1"><br><br>
                        <?php
                        echo 'Que desea consultar: <select name="Combobox" id="box"> 
                            <option value= "Ausencias" selected="selected">Ausencias</option>;
                            <option value = "Tardias" selected = "selected">Tardías</option >;
                            <option value= "Todo" selected="selected">Todo</option>';

                        echo '</select>';
                        ?>

                        <br/><br/>
                        <input type="button" name="enviarConsulta" value="Consultar" class="boton" id="buscar" />
                        <br/><br/>
                    </div>


                    <div id="info_usuario">
                        <!--ajax-->

                    </div>


                </div>
            </div>
        </div>
        <div class="clearfix"></div>
        <div class="shadow-main"></div>
    </div>
</body>
<!--<script src="<?php echo base_url(); ?>js/autocomplete_consulta.js" type="text/javascript"></script>-->
<script type="text/javascript">
    function auto(jefe){
        var searched = $('#search').val();
        var fullurl = $('#hiddenurl').val() + 'index.php/ver_marcas/getResult/' + searched + '?ced='+jefe;
        $.getJSON(fullurl,function(result){
            $.getJSON(fullurl,function(result){
                var elements = [];
                $.each(result,function(i,val){
                    elements.push(val.nombre+' '+val.apellidos+", "+val.cedula);
                })
                    
                $('#search').autocomplete({                    
                    source : elements
                })
            })
        })
    }
    $('#buscar').click(function(){      
        var name = $("#search").val();
        strDate1 = $('#desde1').val();
        strDate2 = $('#hasta1').val();
        var msj = '';
        if(!name){
            alert('Ingrese una cedula o un nombre');
            return false;
        }
        if(strDate1 == "Seleccione la fecha" || strDate2 == "Seleccione la fecha"){
            alert('Seleccione un rango de fechas');
            return false;
        }
                
        var dateParts1 = strDate1.split("/");
        var FechaDesde = new Date(dateParts1[2], dateParts1[1] , dateParts1[0]);
        var desde = FechaDesde.getFullYear()+"-"+FechaDesde.getMonth()+"-"+FechaDesde.getDate();
        //Fecha Hasta
    
        var dateParts2 = strDate2.split("/");
        var FechaHasta = new Date(dateParts2[2], dateParts2[1] , dateParts2[0]);
        var hasta = FechaHasta.getFullYear()+"-"+FechaHasta.getMonth()+"-"+FechaHasta.getDate();
        
        if(FechaDesde > FechaHasta){
            alert("Error en la fechas, deben tener orden cronológico");
            return false;
        }
        if(name.indexOf(',') != -1){
            var nombre = name.substring(0,name.indexOf(','));
            var aux = name.substring(name.indexOf(',')+2);
            if(aux != ""){
                name = aux;
            }
            
        }else{
            msj ="Seleccione el usuario en las sugerencias,\n\para que la búsqueda sea más precisa";
        }
        var form_data = {
            nombre: nombre,
            cedula: name,
            FdesdeView: strDate1,
            FhastaView: strDate2,
            Fdesde: desde,
            Fhasta: hasta,
            Tmarca: $("#box").val(),
            msj: msj,
            ajax: '1'
        };

        $.ajax({
            url: "<?php echo site_url('paginacion/consultas'); ?>",
            type: 'POST',
            data: form_data,
            success: function(msg){
                $('#info_usuario').html(msg);

            }


        });
        return false; 
    });    

    $(function() {
        $( "#desde1" ).datepicker({
            altField: "#desde1",
            showAnim: "drop",
            dateFormat: "dd/mm/yy"
        });
            
    });          
    $(function() {
        $( "#hasta1" ).datepicker({
            altField: "#hasta1",
            showAnim: "drop",
            dateFormat: "dd/mm/yy" 
        });
            
    }); 
</script>
</html>
